<script setup>
import {statusTagText, statusTagType, SubmitVO} from "@/model/submit.js";
import {diffTagText, diffTagType} from "@/model/pool.js";
import {useRoute, useRouter} from "vue-router";
import {r_s_get} from "@/request/api/submit.js";
import {onMounted, ref} from "vue";

const route = useRoute();
const router = useRouter();

const submitInfo = ref({...SubmitVO});

const getSubmitInfo = () => {
  r_s_get(route.params.submitId).then((data) => {
    submitInfo.value = data;
  });
}
const back = () => {
  router.back();
}

onMounted(() => {
  getSubmitInfo();
})

</script>

<template>
  <div class="index-all">
    <div>
      <el-button class="back" link @click="back"><- 返回</el-button>
    </div>
    <el-descriptions class="desc" :column="3" title="提 交 详 细 信 息">
      <el-descriptions-item label="题 号:" width="200px">
        {{ submitInfo.poolVO.poolId }}
      </el-descriptions-item>
      <el-descriptions-item label="标 题:" width="200px">
        {{ submitInfo.poolVO.title }}
      </el-descriptions-item>
      <el-descriptions-item label="难 度:" width="200px">
        <el-tag :type="diffTagType(submitInfo.poolVO.difficulty)">
          {{ diffTagText(submitInfo.poolVO.difficulty) }}
        </el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="描 述:" :span="3">
        <div v-html="submitInfo.poolVO.description"/>
      </el-descriptions-item>
      <el-descriptions-item :span="3" :disabled="true"/>
      <el-descriptions-item label="状 态:">
        <el-tag :type="statusTagType(submitInfo.status)">
          {{ statusTagText(submitInfo.status) }}
        </el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="耗 时:">
        {{ submitInfo.useMilTime || '--' }} ms
      </el-descriptions-item>
      <el-descriptions-item label="内 存:">
        {{ submitInfo.useKbMemory <= 0 ? '--' : submitInfo.useKbMemory }} kb
      </el-descriptions-item>
      <el-descriptions-item label="提 交 时 间:">
        {{ submitInfo.putTime }}
      </el-descriptions-item>
      <el-descriptions-item label="错 误 信 息:" :span="2">
        {{ submitInfo.errorMsg || '--' }}
      </el-descriptions-item>
      <el-descriptions-item label="提 交 代 码:">
        {{ submitInfo.codeType }}
      </el-descriptions-item>
    </el-descriptions>
    <el-input class="code" type="textarea" v-model="submitInfo.code" :rows="27" resize="none" readonly/>
  </div>
</template>

<style scoped>
.back {
  font-size: 16px;
  color: black;
  margin: 20px 1px 40px 1px;
}

.desc {
  min-width: 1000px;
  max-width: 1500px;
}

.code {
  display: inline-block;
  padding: 5px;
  margin-bottom: 50px;
  width: 1000px;
  height: 600px;
  max-height: 600px;
  overflow: auto;
  border: darkgrey solid 1px;
  border-radius: 5px;
  background: #F2F3F5;
}

:deep(strong) {
  font-weight: bold;
  padding: 0 5px 0 5px;
}


</style>